<template>
  <div class="wrapper">
    <!-- header部分 -->
    <header>
      <p><Back></Back>修改商家信息</p>
    </header>

    <!-- 表单部分 -->
    <div class="form-container">
      <div class="form-group">
        <label>商家名称</label>
        <input type="text" v-model="business.businessName" placeholder="请输入商家名称">
      </div>
      
      <div class="form-group">
        <label>商家地址</label>
        <input type="text" v-model="business.businessAddress" placeholder="请输入商家地址">
      </div>
      
      <div class="form-group">
        <label>商家简介</label>
        <textarea v-model="business.businessExplain" placeholder="请输入商家简介"></textarea>
      </div>
      
      <div class="form-group">
        <label>起送价格(¥)</label>
        <input type="number" v-model="business.starPrice" placeholder="请输入起送价格">
      </div>
      
      <div class="form-group">
        <label>配送费(¥)</label>
        <input type="number" v-model="business.deliveryPrice" placeholder="请输入配送费">
      </div>
      
      <div class="submit-btn">
        <button @click="updateBusiness">保存修改</button>
      </div>
    </div>
  </div>
</template>

<script>
import Back from '../components/Back.vue';

export default {
  name: 'BusinessInfoEdit',
  components: {
    Back
  },
  data() {
    return {
      business: {
        businessId: 0,
        businessName: '',
        businessAddress: '',
        businessExplain: '',
        starPrice: 0,
        deliveryPrice: 0
      }
    };
  },
  created() {
    // 获取商家信息
    this.business = this.$getSessionStorage('business');
    if (!this.business) {
      alert('请先登录');
      this.$router.push({ path: '/businessLogin' });
      return;
    }
    
    // 确保所有字段有默认值，防止出现 undefined
    this.business = {
      businessId: this.business.businessId || 0,
      businessName: this.business.businessName || '',
      businessAddress: this.business.businessAddress || '',
      businessExplain: this.business.businessExplain || '',
      starPrice: this.business.starPrice || 0,
      deliveryPrice: this.business.deliveryPrice || 0,
      ...this.business
    };
  },
  methods: {
    updateBusiness() {
      // 表单验证
      if (!this.business.businessName) {
        alert('商家名称不能为空');
        return;
      }
      if (!this.business.businessAddress) {
        alert('商家地址不能为空');
        return;
      }
      if (!this.business.businessExplain) {
        alert('商家简介不能为空');
        return;
      }
      if (this.business.starPrice < 0) {
        alert('起送价格不能为负数');
        return;
      }
      if (this.business.deliveryPrice < 0) {
        alert('配送费不能为负数');
        return;
      }
      
      // 确保数值类型正确
      const starPrice = parseFloat(this.business.starPrice) || 0;
      const deliveryPrice = parseFloat(this.business.deliveryPrice) || 0;
      
      // 编码URI组件，防止特殊字符导致请求失败
      const businessName = encodeURIComponent(this.business.businessName);
      const businessAddress = encodeURIComponent(this.business.businessAddress);
      const businessExplain = encodeURIComponent(this.business.businessExplain);
      
      // 发送更新请求
      const url = `BusinessController/updateBusiness/${this.business.businessId}/${businessName}/${businessAddress}/${businessExplain}/${starPrice}/${deliveryPrice}`;
      
      this.$axios.post(url)
        .then(response => {
          if (response.data.code === 200) {
            alert('商家信息更新成功');
            
            // 更新Session Storage中的商家信息
            const business = this.$getSessionStorage('business');
            if (business) {
              business.businessName = this.business.businessName;
              business.businessAddress = this.business.businessAddress;
              business.businessExplain = this.business.businessExplain;
              business.starPrice = starPrice;
              business.deliveryPrice = deliveryPrice;
              this.$setSessionStorage('business', business);
            }
            
            // 返回商家管理页面
            this.$router.push({ path: '/businessManage' });
          } else {
            alert('更新失败: ' + response.data.message);
          }
        })
        .catch(error => {
          console.error('更新失败', error);
          alert('更新失败，请稍后重试');
        });
    }
  }
};
</script>

<style scoped>
.wrapper {
  width: 100%;
  height: 100%;
  background-color: #f5f5f5;
}

/****************** header部分 ******************/
.wrapper header {
  width: 100%;
  height: 12vw;
  background-color: #0097FF;
  color: #fff;
  font-size: 4.8vw;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
}

/****************** 表单部分 ******************/
.form-container {
  margin-top: 16vw;
  padding: 4vw;
  background-color: #fff;
}

.form-group {
  margin-bottom: 4vw;
}

.form-group label {
  display: block;
  font-size: 4vw;
  color: #333;
  margin-bottom: 2vw;
}

.form-group input,
.form-group textarea {
  width: 100%;
  padding: 2.5vw;
  font-size: 4vw;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}

.form-group textarea {
  height: 20vw;
  resize: none;
}

.submit-btn {
  margin-top: 6vw;
}

.submit-btn button {
  width: 100%;
  height: 10vw;
  background-color: #0097FF;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 4vw;
  font-weight: bold;
}
</style> 